@import "variables.scss";
.home_wrap{
    width: 100%;
    .home-til-l,
    .home-til-r{
        position: absolute;top: 50%;
        transform: translate(0,-50%);
        .shadow{
            position: absolute;z-index: 11;
            animation-duration: 2s;
        }
    }
    .home-til-l{
        left: 10%;
        .shadow{           
            left: -17px;top: -6px;
        }
    }
    .home-til-r{
        right:10.5%;
        .shadow{
           left: -18px;top: -20px; 
        }
    }

    .enter{
        position: fixed;width: 420px;height: 160px;background: transparent;
        bottom: 20%;left: 50%;margin-left: -220px;
        .txt{
            opacity: 0;
        }
        &:before,
        &:after{
            content: '';
            width: 160px;height: 160px;border-radius: 50%;
            position: absolute;left: 50%;margin-left: -80px;top: 0;
            background:-webkit-radial-gradient(#fcefb4, rgba(252,239,168,0.5),rgba(252,239,168,0.1));
            filter: blur(10px);
            opacity: 0;
            transform: scale(0);
            transition: all .375s $bezier-mazel;
            animation: fadeZoom 2.5s linear infinite;
        }
        &:after{
            animation-delay: 1.5s;
        }
    }

}

.lantern{
    width: 44px;height:113px;
    .inner{
        animation-duration: 10s;
        .hover{
            width: 70px;height: 136px;
            background: url(../images/lantern_hover.png);
            display: block;
            position: absolute;left: -13px;top: -12px;
            animation-duration: 2.5s;
        }
    }
}
.lantern-item1{
    position: absolute;top: -220px;right: 5px;z-index: 12;
}
.lantern-item2{
    position: absolute;top: -48px;left: -70px;z-index: 13;
    animation-delay: .25s;
}
.lantern-item3{
    position: absolute;top: 50%;left: -50px;z-index: 13;margin-top: -22px;
    transform: scale(0.6);
}
.lantern-item4{
    position: absolute;top: -70px;right: -50px;z-index: 13;
    animation-delay: .5s;
}

.lantern2{
    width: 77px;height: 45px;
    background: url(../images/lantern2.png) no-repeat;
    display: block;
    position: absolute;left: 44px;bottom: 15%;z-index: 189;
    &.top{
        right: 6.04%;left: auto;bottom: 70%;
        background-size: 50% 50%;
    }
}

@media screen and (max-width:1580px) {
    .home_wrap{
        .home-til-l{
            left: 30px;
        }
        .home-til-r{
            right:30px;
        }    
    }
    
}